<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@page import="com.crm.entity.ClientUser"%>
<%@page import="java.util.List"%>
<%@page import="com.crm.entity.Clientdet"%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<link href="<%=application.getContextPath()%>/css/css-crm.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<%=application.getContextPath()%>/js/jquery-1.7.2.min.js"></script>
<script language="javaScript" src="<%=application.getContextPath()%>/js/jquery-ui-1.8.20.custom.min.js"></script>

<script type="text/javascript" src="<%=application.getContextPath()%>/js/jquery-1.6.min.js"></script>	
<script type="text/javascript" src="<%=application.getContextPath()%>/js/jquery-ui-1.8.17.custom.min.js"></script>	
<link rel="stylesheet" href="<%=application.getContextPath()%>/css/jquery-ui-1.8.17.custom.css"/>
<style >
.ui-dialog {
	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	
}
</style>
<script language="javascript">

        function addRow(userTable) {
 
        	var table = document.getElementById(userTable);
 			var rowCount = table.rows.length;
			var row = table.insertRow(rowCount);
			
			
			table.setAttribute("bgColor", "#C5E4EB");
		    var cell0=row.insertCell(0);
		    cell0.setAttribute("bgColor","#FFFFFF");
		    cell0.innerHTML='<input type="checkbox" name="chkbox"/>';
			var cell1 = row.insertCell(1);
		    cell1.innerHTML = rowCount ;
           	cell1.setAttribute("bgColor","#FFFFFF");
                      	
            var cell2 = row.insertCell(2);
            cell2.setAttribute("bgColor","#FFFFFF");
            var element2 = document.createElement("input");
			element2.type = "text";
			element2.name="userName"+rowCount;
			element2.id="userName"+rowCount;
			element2.className="user";
			element2.size="15";
            cell2.appendChild(element2);
            
            
            var cell3 = row.insertCell(3);
            cell3.setAttribute("bgColor","#FFFFFF");
            var element3 = document.createElement("input");
			element3.type = "text";
			element3.name="designation"+rowCount;
			element3.id="designation"+rowCount;
			element3.className="user";
			element3.size="15";
            cell3.appendChild(element3);
            
            
            var cell4 = row.insertCell(4);
            cell4.setAttribute("bgColor","#FFFFFF");
            cell4.innerHTML='<select name="userGroup'+rowCount+'" class="groupDiv" id="userGroup'+rowCount+'" style="border: 0px;">'
	 			+' <option value="Please Select">Please Select</option>'
                +'</select>';
                
            var cell5 = row.insertCell(5);
            cell5.setAttribute("bgColor","#FFFFFF");
            cell5.innerHTML='<select name="division'+rowCount+'" class="dropDiv" id="division'+rowCount+'" style="border: 0px;">'
	 			+' <option value="Please Select">Please Select</option>'
                +'</select>';
                
                
			var cell6 = row.insertCell(6);
			cell6.setAttribute("bgColor","#FFFFFF");
			 var element6= document.createElement("input");
				element6.type = "text";
				element6.name="phone"+rowCount;
				element6.id="phone"+rowCount;
				element6.className="user";
				element6.size="15";
	            cell6.appendChild(element6);
	            
	            var cell7 = row.insertCell(7);
				cell7.setAttribute("bgColor","#FFFFFF");
				 var element7= document.createElement("input");
					element7.type = "text";
					element7.name="cell"+rowCount;
					element7.id="usercell"+rowCount;
					element7.className="user";
					element7.size="15";
		            cell7.appendChild(element7);
			
		            var cell8 = row.insertCell(8);
					cell8.setAttribute("bgColor","#FFFFFF");
					 var element8= document.createElement("input");
						element8.type = "text";
						element8.name="fax"+rowCount;
						element8.id="userfax"+rowCount;
						element8.className="user";
						element8.size="15";
			            cell8.appendChild(element8);
			            
			
			 var cell9 = row.insertCell(9);
			//cell5.innerHTML='<input name="org[]"  id="org"'+rowcount+' type="text" class="tablebox-form" size="8"  />';
			 cell9.setAttribute("bgColor","#FFFFFF");
			 var element9 = document.createElement("input");
				element9.type = "text";
				element9.name="email"+rowCount;
				element9.id="email"+rowCount;
				element9.className="email";
				element9.size="15";
	            cell9.appendChild(element9);
				
            var hidden=document.createElement("input");
            hidden.type="hidden";
            hidden.name="rowcount";
            hidden.value=rowCount;
 			cell6.appendChild(hidden);

       
 			 var colcount=parseInt($("#rowcount").val());
 			 colcount=colcount+1;
 			 $("#rowcount").val(colcount);
 			 $("#userName"+rowCount).focus();
        }
        function deleteRow(userTable) {
        try {
            var table = document.getElementById(userTable);
            var rowCount = table.rows.length;
 			
            for(var i=0; i<rowCount; i++) {
                var row = table.rows[i];
                var chkbox = row.cells[0].childNodes[0];
                if(null != chkbox && true == chkbox.checked) {
                    table.deleteRow(i);
                    rowCount--;
                    i--;
                }
 
            }
			for(var i=0; i<rowCount-1; i++)

           table.rows[i+1].cells[1].innerHTML = i+1;
            }catch(e) {
               // alert(e);
            }
            
            
            var colcount=parseInt($("#rowcount").val());
			 colcount=colcount-1;
			 $("#rowcount").val(colcount);
        }
      
       /*  function deleteRow(userTable) {
            try {
            var table = document.getElementById(userTable);
            var rowCount = table.rows.length;
 			
            for(var i=0; i<rowCount; i++) {
                var row = table.rows[i];
                var chkbox = row.cells[0].childNodes[0];
                if(null != chkbox && true == chkbox.checked) {
                    table.deleteRow(i);
                    rowCount--;
                    i--;
                }
 
            }
			for(var i=0; i<rowCount-1; i++)

           table.rows[i+1].cells[1].innerHTML = i+1;
            }catch(e) {
                alert(e);
            }
        } */
       

    </script>
    <script language="javascript">
    $(document).ready(function(){
    	$('.dropDiv').live('focus',function(){
  
    		
    		var e2=document.getElementById(this.id);
    		
    	   	
    		var divs=$("#divs").val();
    		
    		if(divs!=""){
    		var temp=divs.split(",");
    		
    		if(temp != null){
    			
    			if(e2.options.length>1){
    			for(var i=0;i<temp.length;i++){
    				if(e2.options.length>i+1){
    				if(e2.options[i+1].value!=temp[i]){
    				var o=document.createElement('option');
    				o.value=temp[i];
    				o.text=temp[i];
    				e2.options.add(o);
    				
    				}
    				}else {
    					var o=document.createElement('option');
        				o.value=temp[i];
        				o.text=temp[i];
        				e2.options.add(o);
    				}
    			}
    			}
    				else{
    					for(var i=0;i<temp.length;i++){
    	    				   	    				
    	    				var o=document.createElement('option');
    	    				o.value=temp[i];
    	    				o.text=temp[i];
    	    				e2.options.add(o);
    	    				
    	    				}
    				}
    	    			
    					
    				}
    		}
    			});
    	
    	$('.groupDiv').live('focus',function(){
    		var e2=document.getElementById(this.id);
    		
    	   	
    		var divs=$("#group").val();
    		//isSpclChar(divs);
    		
    		if(divs!=""){
    		var temp=divs.split(",");
    		
    		
    		if(temp != null){
    			
    			if(e2.options.length>1){
    			for(var i=0;i<temp.length;i++){
    				if(e2.options.length>i+1){
    				if(e2.options[i+1].value!=temp[i]){
    				var o=document.createElement('option');
    				o.value=temp[i];
    				o.text=temp[i];
    				e2.options.add(o);
    				
    				}
    				}else {
    					var o=document.createElement('option');
        				o.value=temp[i];
        				o.text=temp[i];
        				e2.options.add(o);
    				}
    			}
    			}
    				else{
    					for(var i=0;i<temp.length;i++){
    	    				   	    				
    	    				var o=document.createElement('option');
    	    				o.value=temp[i];
    	    				o.text=temp[i];
    	    				e2.options.add(o);
    	    				
    	    				}
    				}
    	    			
    					
    				}
    		}
    			});
    	
    	
    	});
    		
   
    </script>
</head>

<body>
<div id="main">
  <%@ include file="common/header.jsp" %>
  <%@ include file="common/submenu.jsp" %>
  <%
	  Clientdet cli=(Clientdet)request.getAttribute("clidet");
	  List<ClientUser> cliUserLst=(List<ClientUser>)request.getAttribute("cliUserlst");
  %>
  <div id="content">
      <div id="clisname"  style="display: none; text-align: center; padding-top:5px;" >
  <label style="font-family:Arial; font-size: 12px; font-weight: bold ; align: center; color: red;">The ClientShort Name is Already Exists!Please Choose Another</label>
    </div>
  <form action="<%=application.getContextPath()%>/client/save.do" method="post">
    <div id="work-area2">
      <div class="heading2">Edit Client Details</div>
      <div class="boxIFS">    
        <table width="100%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td width="366"><table width="1087" border="0" cellspacing="0" cellpadding="0">
                <tr>
                  <td width="6">&nbsp;</td>
                  <td width="164">&nbsp;</td>
                  <td width="205">&nbsp;</td>
                  <td width="61">&nbsp;</td>
                  <td width="165">&nbsp;</td>
                  <td width="486">&nbsp;</td>
                </tr>
                <tr>
                  <td>&nbsp;</td>
                  <td align="left" valign="top">Organisation Name</td>
                  <td align="left" valign="top"><input type="text" name="orgName" id="orgName" class="form" value="<%=cli.getOrganisation() %>"  />   </td>
                  <td>&nbsp;</td>
                  <td align="left" valign="top">Group/Directorate</td>
                  <td align="left" valign="top"><input type="text" name="group" id="group" class="form" value="<%=cli.getGroup() %>" /></td>
                </tr>
                <tr>
                  <td height="5"></td>
                  <td height="5" align="left" valign="top"></td>
                  <td height="5" align="left" valign="top">                 </td>
                  <td align="left" valign="top"></td>
                  <td align="left" valign="top"></td>
                  <td align="left" valign="top"></td>
                </tr>
                <tr>
                  <td>&nbsp;</td>
                  <td align="left" valign="top">Division</td>
                  <td align="left" valign="top"><input type="text" name="div" id="divs" class="form" value="<%=cli.getDivision() %>" /></td>
                  <td>&nbsp;</td>
                  <td align="left" valign="top">Company Short Name</td>
                  <input type="hidden" name="id" value="<%= cli.getId()%>"/>
                  <td align="left" valign="top"><input type="text" name="compShrtName" id="compShrtName" onblur="javascript:busNameCheck();"  class="form" value="<%=cli.getShrtname() %>" /></td>
                </tr>
                <tr>
                  <td height="5"></td>
                  <td height="5" align="left" valign="top"></td>
                  <td height="5" align="left" valign="top"></td>
                  <td align="left" valign="top"></td>
                  <td align="left" valign="top"></td>
                  <td align="left" valign="top"></td>
                </tr>
                <tr>
                  <td>&nbsp;</td>
                  <td align="left" valign="top">Tele Number</td>
                  <td align="left" valign="middle"><input type="text" name="tellNumber" class="form" value="<%=cli.getTell()%>" /></td>
                  <td>&nbsp;</td>
                  <td align="left" valign="top">WebSite</td>
                  <td align="left" valign="top"><input type="text" name="website" id="website" value="<%=cli.getWebsite()%>"  class="form"/></td>
                </tr>
                <tr>
                  <td>&nbsp;</td>
                  <td>&nbsp;</td>
                  <td>&nbsp;</td>
                  <td>&nbsp;</td>
                  <td>&nbsp;</td>
                  <td>&nbsp;</td>
                </tr>
                <tr>
                  <td>&nbsp;</td>
                  <td align="left" valign="top">Fax</td>
                  <td align="left" valign="top"><input type="text" name="fax" class="form" value="<%=cli.getFax() %>" /></td>
                  <td>&nbsp;</td>
                  <td align="left" valign="top">Email</td>
                  <td align="left" valign="top"><input  type="text" name="cliEmail" class="form-lowercase" value="<%=cli.getEmail() %>" /></td>
                </tr>
                <tr>
                  <td>&nbsp;</td>
                  <td align="left" valign="top">&nbsp;</td>
                  <td align="left" valign="top">&nbsp;</td>
                  <td>&nbsp;</td>
                  <td align="left" valign="top">&nbsp;</td>
                  <td align="left" valign="top">&nbsp;</td>
                </tr>
                <tr>
                  <td>&nbsp;</td>
                  <td align="left" valign="top">Customer Type</td>
                  <td align="left" valign="top"><table width="180px" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                        <td width="26"><input type="radio" name="ctype" value="public"  <%if(cli.getOrgtype().equalsIgnoreCase("public")) {%> checked="checked" <%} %>/></td>
                        <td width="52">Public</td>
                        <td width="27"><input type="radio" name="ctype" value="private"  <%if(cli.getOrgtype().equalsIgnoreCase("private")){%>checked="checked" } <%}%>/></td>
                        <td width="195">Private</td>
                      </tr>
                  </table></td>
                  <td>&nbsp;</td>
                  <td align="left" valign="top">Address</td>
                  <td align="left" valign="top"><textarea name="address" class="form-textarea"><%=cli.getAddr() %></textarea></td>
                </tr>
                  <tr>
                  <td>&nbsp;</td>
                  <td>&nbsp;</td>
                  <td>&nbsp;</td>
                  <td>&nbsp;</td>
                  <td>&nbsp;</td>
                  <td>&nbsp;</td>
                  </tr>
            </table></td>
            </tr>
        </table>
        
        
      </div>
       <div class="boxtable">
        <table width="100%" id="userTable" border="0" cellpadding="4" cellspacing="1" bgcolor="#C5E4EB">
          <tr>
          	<td width="36" height="30" align="left" valign="middle" background="<%=application.getContextPath()%>/images/table-box.jpg"  style="background-repeat:repeat-x"> </td>
            <td width="36" height="30" align="left" valign="middle" background="<%=application.getContextPath()%>/images/table-box.jpg"  style="background-repeat:repeat-x">S.No </td>
            <td width="138" align="left" valign="middle" background="<%=application.getContextPath()%>/images/table-box.jpg"   style="background-repeat:repeat-xbgcolor="#FFFFFF">Name of the User</td>
            <td width="138" align="left" valign="middle" background="<%=application.getContextPath()%>/images/table-box.jpg"   style="background-repeat:repeat-xbgcolor="#FFFFFF">Designation</td>
            <td width="140" align="left" valign="middle" background="<%=application.getContextPath()%>/images/table-box.jpg"   style="background-repeat:repeat-xbgcolor="#FFFFFF">Group</td>
            <td width="140" align="left" valign="middle" background="<%=application.getContextPath()%>/images/table-box.jpg"   style="background-repeat:repeat-xbgcolor="#FFFFFF"> Division</td>
            <td width="162" align="left" valign="middle" background="<%=application.getContextPath()%>/images/table-box.jpg"  style="background-repeat:repeat-x bgcolor="#FFFFFF">Phone</td>
            
            <td width="186" align="left" valign="middle" background="<%=application.getContextPath()%>/images/table-box.jpg"   style="background-repeat:repeat-xbgcolor="#FFFFFF">Cell</td>
            <td width="186" align="left" valign="middle" background="<%=application.getContextPath()%>/images/table-box.jpg"   style="background-repeat:repeat-xbgcolor="#FFFFFF">Fax</td>
            <td width="186" align="left" valign="middle" background="<%=application.getContextPath()%>/images/table-box.jpg"   style="background-repeat:repeat-xbgcolor="#FFFFFF">Email</td>
          </tr>
         <%
         if(cliUserLst!=null){
 	      	for(int i=0;i<cliUserLst.size();i++){
         %>
          <tr>
          <input type="hidden" name="userId<%=i+1 %>" value="<%=cliUserLst.get(i).getId()%>"/>
          	<td align="center" valign="middle" bgcolor="#FFFFFF"><input type="checkbox" name="chkbox"/></td>
            <td bgcolor="#FFFFFF"><%=i+1 %></td>
            <td align="left" valign="top" bgcolor="#FFFFFF"><input type="text" name="userName<%=i+1 %>" value="<%= cliUserLst.get(i).getUsername()%>"/></td>
            <td align="left" valign="top" bgcolor="#FFFFFF"><input type="text" name="designation<%=i+1 %>" value="<%= cliUserLst.get(i).getDesignation()%>"/></td>
            <td align="left" valign="top" bgcolor="#FFFFFF">
            <select class="groupDiv" name="userGroup<%=i+1 %>"  style="border: 0px;" id="userGroup<%=i+1 %>" >
                 <option value="<%=cliUserLst.get(i).getGroup()%>"><%= cliUserLst.get(i).getGroup()%></option>
                </select>
            </td>
            <td align="left" valign="top" bgcolor="#FFFFFF">
            <select class="dropDiv" name="division<%=i+1 %>"  style="border: 0px;" id="division<%=i+1 %>" >
                 <option value="<%=cliUserLst.get(i).getDivision()%>"><%= cliUserLst.get(i).getDivision()%></option>
                </select>
            </td>
            <td align="left" valign="top" bgcolor="#FFFFFF"><input type="text" name="phone<%=i+1 %>" value="<%=cliUserLst.get(i).getPhn()%>"/></td>
            
            <td align="left" valign="top" bgcolor="#FFFFFF"><input type="text" name="cell<%=i+1 %>" value="<%=cliUserLst.get(i).getCellPhone()%>"/></td>
            <td align="left" valign="top" bgcolor="#FFFFFF"><input type="text" name="fax<%=i+1 %>" value="<%=cliUserLst.get(i).getFax()%>"/></td>
            <td align="left" valign="top" bgcolor="#FFFFFF"><input style="text-transform:lowercase" type="text" name="email<%=i+1 %>" value="<%= cliUserLst.get(i).getEmail()%>"/></td>
          </tr>
          <%
 	      	}
 	      	}
          %>
         
        </table>
         <div class="box3">
	    				<div class="buttonleft"><a href="javascript: addRow('userTable')" >Add User</a></div> 
                                   <div class="buttonleft"><a href="javascript: deleteRow('userTable')" >Delete User</a></div>
                      				 <input type="hidden" id="rowcount" name="rowcount" value="<%= cliUserLst.size()%>"/>
                        </div>
            
                 <div class="box3">
	    			<div class="buttton-main">
	    				<input type="reset" class="button" value="Clear" />
	    				<input type="submit" class="button" value="Update"/>
	    			</div>
	  			</div> </div>
      
    </div>
    </form>


   

  </div>
  <div id="footer"></div>  
</div>
</body>
</html>
 
    <script language="JavaScript" type="text/javascript">
    
	function busNameCheck(busName,id){
	var clid=$("#clientid").val();
		//alert("csname is clicked");
		
		alert("this is "+busName+clid);
		var data="name="+busName+"&cliid="+clid;
		if(busName!=null && busName!=""){
			$.ajax({
				url:" <%=application.getContextPath()%>/client/cliNameEditCheck.do",
				mimetype: "text/plain",
				method: "post",
				data: data,
				cache:false,
				success: function(res){
					//alert("Response Is :"+res);
					if(res=="true"){
						$("#clisname").hide();
					}else{
						//jAlert("Client ShortName Already Exists \n Please Enter Another.");
						$("#clisname").show();
						$("#compShrtName").focus();
					}
				}
			
			});
		}
	}
	</script>